summaryrefslogtreecommitdiffstats
path: root/index.html
diff options
context:
space:
mode:
authorAnton Šijanec <sijanecantonluka@gmail.com>2020-03-30 15:12:21 +0200
committerAnton Šijanec <sijanecantonluka@gmail.com>2020-03-30 15:12:21 +0200
commit49ff1d32a7e3569a46e2311beedd66a6bb0520e4 (patch)
tree05e8bb48ec29058d06a38d32045553a100e2fe55 /index.html
downloadupn-49ff1d32a7e3569a46e2311beedd66a6bb0520e4.tar
upn-49ff1d32a7e3569a46e2311beedd66a6bb0520e4.tar.gz
upn-49ff1d32a7e3569a46e2311beedd66a6bb0520e4.tar.bz2
upn-49ff1d32a7e3569a46e2311beedd66a6bb0520e4.tar.lz
upn-49ff1d32a7e3569a46e2311beedd66a6bb0520e4.tar.xz
upn-49ff1d32a7e3569a46e2311beedd66a6bb0520e4.tar.zst
upn-49ff1d32a7e3569a46e2311beedd66a6bb0520e4.zip
Diffstat (limited to 'index.html')
-rw-r--r--index.html241
1 files changed, 241 insertions, 0 deletions
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..bfa9441
--- /dev/null
+++ b/index.html
@@ -0,0 +1,241 @@
+<html>
+ <head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="manifest" href="./manifest.json">
+ <title>
+ Orodje za izdelavo UPN nalogov, (C) Anton Luka Šijanec 2020
+ </title>
+ <style>
+ @font-face {
+ font-family: myriadpro;
+ src: url(myriadpro.otf);
+ }
+ @font-face {
+ font-family: courbd;
+ src: url(courbd.ttf);
+ }
+ body {
+ font-family: myriadpro;
+ background: black;
+ color: white;
+ }
+ input {
+ font-family: courbd;
+ border: 0;
+ width: 100%;
+ background: transparent;
+ position: fixed;
+ color: black;
+ }
+ #div {
+ background-color: white;
+ display: inline-block;
+ }
+ canvas {
+ background: white;
+ color: black;
+ position: fixed;
+ width: 0;
+ heigth: 0;
+ }
+ </style>
+ <script src="qrcode.js"></script>
+ <script src="qrcode.tosjis.js"></script>
+ <script src="iso-8859-2.js"></script>
+ <script src="sw.js"></script>
+ <script>
+ if ("serviceWorker" in navigator) {
+ navigator.serviceWorker.register("./sw.js")
+ .then(() => { })
+ .catch((err) => console.log("Service worker registration failed", err));
+ }
+ // Listen to messages from service workers.}
+ if(navigator.serviceWorker) {
+ navigator.serviceWorker.addEventListener('message', (event) => {
+ if (event.data.msg === "install") {
+ window.location.replace("./index.html");
+ }
+ });
+ }
+ if (location.protocol != 'https:') {
+ location.href = 'https:' + window.location.href.substring(window.location.protocol.length);
+ }
+ var canvasEl, errorEl, qrtext;
+ function httpGet(theUrl) {
+ var xmlHttp = new XMLHttpRequest();
+ xmlHttp.open( "GET", theUrl, false ); // false for synchronous request
+ xmlHttp.send( null );
+ return xmlHttp.responseText;
+ }
+ var unikatnapolja = ["KodaNamena", "ImePlacnika", "UlicaPlacnika", "KrajPlacnika", "NamenPlacila", "RokPlacila", "Znesek", "IbanPrejemnika", "ImePrejemnika", "UlicaPrejemnika", "KrajPrejemnika", "IbanPlacnika", "ReferencaPlacnika1", "ReferencaPlacnika2", "ReferencaPrejemnika1", "ReferencaPrejemnika2", "PodpisPlacnikaNeobveznoZig1", "PodpisPlacnikaNeobveznoZig2", "DatumPlacila", "Dvig", "Polog", "Nujno"];
+ document.addEventListener("DOMContentLoaded", function() {
+ document.getElementById("div").insertAdjacentHTML( 'afterbegin', httpGet("upn.svg"));
+ var element = "ImePlacnika";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "UlicaPlacnika";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "KrajPlacnika";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "NamenPlacila";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "RokPlacila";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "Znesek";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "IbanPrejemnika";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "ReferencaPrejemnika1";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "ReferencaPrejemnika2";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "ImePrejemnika";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "UlicaPrejemnika";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "KrajPrejemnika";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+"Belo style='top:"+document.getElementById("belaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("belaVnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById("belaVnos"+element).childNodes[0].nodeValue="";
+ var element = "QRKoda";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<canvas id=polje"+element+"Rdece style='top:"+document.getElementById("rdecaVnos"+element).getBoundingClientRect().top+";left:"+document.getElementById("rdecaVnos"+element).getBoundingClientRect().left+"' >");
+ for (const element of unikatnapolja) {
+ if(document.getElementById("rdecaVnos"+element) != null) var ccc = "rdeca"; else
+ if(document.getElementById("rumenaVnos"+element) != null) var ccc = "rumena"; else
+ if(document.getElementById("belaVnos"+element) != null) var ccc = "bela";
+ document.getElementById("div").insertAdjacentHTML( 'beforeend', "<input id=polje"+element+" style='top:"+document.getElementById(ccc+"Vnos"+element).getBoundingClientRect().top+";left:"+document.getElementById(ccc+"Vnos"+element).getBoundingClientRect().left+"' >");
+ document.getElementById(ccc+"Vnos"+element).childNodes[0].nodeValue="";
+ }
+ var unikatnekljukice;
+ addeventlisteners();
+ canvasEl = document.getElementById('poljeQRKodaRdece');
+ errorEl = document.getElementById('error');
+ });
+ function addeventlisteners() {
+ var belapolja = ["ImePlacnika", "UlicaPlacnika", "KrajPlacnika", "NamenPlacila", "RokPlacila", "Znesek", "IbanPrejemnika", "ImePrejemnika", "UlicaPrejemnika", "KrajPrejemnika", "ReferencaPrejemnika1", "ReferencaPrejemnika2"];
+ for (const element of belapolja) {
+ document.getElementById("polje"+element).addEventListener("keyup", function() {
+ document.getElementById("polje"+element+"Belo").value = document.getElementById("polje"+element).value;
+ });
+ document.getElementById("polje"+element+"Belo").addEventListener("keyup", function() {
+ document.getElementById("polje"+element).value = document.getElementById("polje"+element+"Belo").value;
+ });
+ }
+ document.addEventListener("keyup", function() {
+ updateQR();
+ });
+ }
+ function debounce (func, wait, immediate) {
+ var timeout
+ return function () {
+ var context = this
+ var args = arguments
+ var later = function () {
+ timeout = null
+ if (!immediate) func.apply(context, args)
+ }
+
+ var callNow = immediate && !timeout
+ clearTimeout(timeout)
+ timeout = setTimeout(later, wait)
+ if (callNow) func.apply(context, args)
+ }
+ }
+
+ function drawQR (text) {
+ errorEl.style.display = 'none'
+ canvasEl.style.display = 'block'
+
+ QRCode.toCanvas(canvasEl, text, {
+ version: 15,
+ errorCorrectionLevel: "M",
+ margin: 0,
+ width: 123.199029921,
+ color: {
+ light: "#ffffff",
+ dark: "#000000"
+ },
+ toSJISFunc: QRCode.toSJIS
+ }, function (error, canvas) {
+ if (error) {
+ canvasEl.style.display = 'none'
+ errorEl.style.display = 'inline'
+ errorEl.textContent = error
+ }
+ })
+ }
+
+ var updateQR = debounce(function () {
+ dpi = window.devicePixelRatio;
+ ctx = canvasEl.getContext('2d');
+ var telo = "UPNQR\n"
+ +document.getElementById("poljeIbanPlacnika").value.replace(/\s/g, '').substring(0, 19)+"\n"
+ +document.getElementById("poljePolog").value.replace(/\s/g, '').substring(0, 1)+"\n"
+ +document.getElementById("poljeDvig").value.replace(/\s/g, '').substring(0, 1)+"\n"
+ +document.getElementById("poljeReferencaPlacnika1").value.replace(/\s/g, '').substring(0, 4)+document.getElementById("poljeReferencaPlacnika2").value.replace(/\s/g, '').substring(0, 22)+"\n"
+ +document.getElementById("poljeImePlacnika").value.substring(0, 33)+"\n"
+ +document.getElementById("poljeUlicaPlacnika").value.substring(0, 33)+"\n"
+ +document.getElementById("poljeKrajPlacnika").value.substring(0, 33)+"\n"
+ +(Number(document.getElementById("poljeZnesek").value.replace(/\s/g, '').substring(3).replace(/\./g, '').replace(',', '.'))*100).toString().padStart(11, "0")+"\n"
+ +document.getElementById("poljeDatumPlacila").value.replace(/\s/g, '').substring(0, 10)+"\n"
+ +document.getElementById("poljeNujno").value.replace(/\s/g, '').substring(0, 1)+"\n"
+ +document.getElementById("poljeKodaNamena").value.replace(/\s/g, '').toUpperCase().substring(0, 4)+"\n"
+ +document.getElementById("poljeNamenPlacila").value.replace(/\s/g, '').substring(0, 42)+"\n"
+ +document.getElementById("poljeRokPlacila").value.replace(/\s/g, '').substring(0, 10)+"\n"
+ +document.getElementById("poljeIbanPrejemnika").value.replace(/\s/g, '').substring(0, 34)+"\n"
+ +document.getElementById("poljeReferencaPrejemnika1").value.replace(/\s/g, '').substring(0, 4)+document.getElementById("poljeReferencaPrejemnika2").value.replace(/\s/g, '').substring(0, 22)+"\n"
+ +document.getElementById("poljeImePrejemnika").value.substring(0, 33)+"\n"
+ +document.getElementById("poljeUlicaPrejemnika").value.substring(0, 33)+"\n"
+ +document.getElementById("poljeKrajPrejemnika").value.substring(0, 33)+"\n";
+ var podpis = "upn.sijanec.eu - Anton Luka Šijanec je spisal programsko opremo, ki je generirala ta UPN. (C) 2020";
+ var qrtext = telo+telo.length.toString().padStart(3, "0")+"\n"+podpis.substring(0, 411-(telo.length+4));
+ console.log(qrtext);
+ var mode = "Byte";
+ if (mode !== 'Auto') {
+ // drawQR([{ data: iso88592.encode(qrtext.replace(/[\t\r]/g,)), mode: mode }])
+ drawQR([{ data: qrtext.replace(/[\t\r]/g,), mode: mode }])
+ } else {
+ // drawQR(iso88592.encode(qrtext.replace(/[\t\r]/g,)))
+ drawQR(qrtext.replace(/[\t\r]/g,))
+ }
+ }, 250)
+ var pxTomm = function(px){
+ return Math.floor(px/($('#my_mm').height()/100)); //JQuery returns sizes in PX
+ };
+ </script>
+ </head>
+ <body>
+ <h1 align="center">
+ Orodje za izdelavo položnic, (C) Anton Luka Šijanec 2020
+ </h1>
+ <div id="div">
+ </div>
+ <hr>
+ <ul>
+ <b>Navodila in opombe za vpisovanje:</b>
+ <li>Številke IBAN morajo biti ločene s presledki na vsake štiri znake.</li>
+ <li>Ko strojno vpisujemo podatke, le-ti ne smejo biti vpisani znak-po-znak med vodila, ki so namenjena zgolj ročnemu vnosu.</li>
+ <li>Kljukice na poljih Polog, Dvig in Nujno označimo z vpisom velike tiskane črke X.</li>
+ <li>Pri poljih Ime, ulica in kraj ne pišemo vejic.</li>
+ <li>Znesek začnemo z tremi zvezdicami (***) in vanj vnesemo tudi cente, ločene z decimalno vejico. Največji znesek je 999.999.999,99 evrov (ena milijarda minus en cent). Celoštevilski del ločimo na segmente po tri mesta s piko. Primer zneska (en milijon dvanajst tisoč petsto triindvajset evrov in triinpetdeset centov): ***1.012.523,53.</li>
+ <li>Datume pišemo v slovenskem formatu brez presledkov (primer: 31.12.1999).</li>
+ <li>Reference pišemo v formatu <i>SI00 225268-32526-222</i>, vendar sem opazil, da delujejo tudi brez pomišljajev.</li>
+ <li>Kode namena najdete na <a href="https://www.nlb.si/sepa-koda-namena-prebivalstvo" target="_blank">spletni strani NLB [odpre v novem zavihku]</a>.</li>
+ <li>Program ne preverja vnosa!</li>
+ </ul>
+ <div id="error">
+ </div>
+ <hr>
+ <i>šijanec/upn, različica 0.0.7</i>
+ </body>
+</html> \ No newline at end of file